<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>medic</title>
    <link rel="stylesheet" href="/Trees/LayUiBac/layui/css/layui.css" media="all">
</head>
<body>

<div class="layui-container">
    <div class="layui-row" style="border: cadetblue 1px solid;padding: 20px;margin-top: 30px">
        <h1>用户登陆日志一览</h1>
        <table id="demo" lay-filter="userTable"></table>
        <div class="layui-col-md4" style="border: cadetblue 1px solid;padding: 20px">
            <br>
            <label class="layui-form-label">起始时间</label>
            <input type="text" class="layui-input" id="date1" style="width: 100px">
            <br>
            <label class="layui-form-label">结束时间</label>
            <input type="text" class="layui-input" id="date2" style="width: 100px">
            <br>
            <button class="layui-btn layui-bg-orange" type="button" id="Find">查询</button>
        </div>
    </div>
</div>


<script src="/Trees/LayUiBac/layui/layui.js"></script>

<script>
    layui.use('laydate', function () {
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#date1' //指定元素
        });

        laydate.render({
            elem: '#date2'
        })
    });
    layui.use('table', function () {
        let $ = layui.$;
        let layer = layui.layer;
        let table = layui.table;
        //第一个实例
        let show = table.render({
            elem: '#demo'
            , url: '/Trees/userLog' //数据接口
            , page: true //开启分页
            , parseData: function (res) { //res 即为原始返回的数据
                return {
                    "code": 0, //解析接口状态
                    "count": res.total, //解析数据长度
                    "data": res.list
                };
            }
            , cols: [[ //表头
                {field: 'note', title: '登录日志'}
                , {field: 'time', title: '具体时间'}
            ]]
        });

        $('#Find').on('click', function () {
            show.reload({
                where: {
                    date1: $('#date1').val()
                    , date2: $('#date2').val()
                }
                , page: {
                    curr: 1
                }
            })
        })
    })
</script>


</body>
</html>